<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>文章列表</title>
    <script src="jquery-1.9.1.min.js"></script>
    <script>
        //当前页码
        var page = 1;

        //时间
        function datefm(timespan) {
            var date = new Date(timespan);
            var y = date.getFullYear();//年
            var m = date.getMonth() + 1;//月//因为月份默认是上月的
            var d = date.getDate();
            return y + "-" + m + "-" + d;
        }

        //分页方法
        function mypage(type) {
            if (type == 1) {
                //上一页
                if (page > 1) {
                    location.href = "list.html?p=" + (page - 1);
                } else {
                    alert("已经在首页了~");
                }
            } else {
                //下一页
                location.href = "list.html?p=" + (page + 1);
            }
        }

        jQuery(function () {
            //更新全局的页码信息
            var params = location.search;
            if (params != "") {
                page = (parseInt(params.split("=")[1]));
            }
            jQuery.getJSON("list", {
                "page": page,  //当前页码
                "size": 2 //每页显示几条
            }, function (data) {
                if (data != null && data.succ == 1) {
                    var html = "";
                    for (var i = 0; i < data.list.length; i++) {
                        var article = data.list[i];
                        html += " <tr>\n" +
                            "            <td>\n" +
                            article.id + "                \n" +
                            "            </td>\n" +
                            "            <td>\n<a href='detail.html?id=" + article.id + "'>" +
                            article.title + " </a>               \n" +
                            "            </td>\n" +
                            "            <td>\n" +
                            article.username + "                \n" +
                            "            </td>\n" +
                            "            <td>\n" +
                            datefm(article.createtime) + "                \n" +
                            "            </td>\n" +
                            "            <td>\n" +
                            datefm(article.updatetime) + "                \n" +
                            "            </td>\n" +
                            "            <td>\n" +
                            article.rcount + "                \n" +
                            "            </td>\n" +
                            "        </tr>";
                    }
                    jQuery("#tab").append(html);
                } else {
                    alert("查询失败!" + data.msg);
                }
            });
        });
    </script>
</head>
<body style="background-image: url(b2.JPG);background-repeat: no-repeat;background-size: 100% auto">
<!--<body style="background: gainsboro">-->
<div style="text-align: center;margin-top: 50px">
    <h1>文章列表</h1>
    <table id="tab" style="width: 80%;margin: auto;" border="1">
        <tr>
            <td>
                编号
            </td>
            <td>
                标题
            </td>
            <td>
                作者
            </td>
            <td>
                发布时间
            </td>
            <td>
                修改时间
            </td>
            <td>
                阅读量
            </td>
        </tr>
    </table>
    <a href="javascript:mypage(1)"> 上一页</a>
    <a href="javascript:mypage(2)">下一页</a>
    <a href="myart.html">返回我的文章</a>
</div>
</div>
</body>
</html>